<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core">

    <h:head>
    </h:head>

    <h:body>

        <a href="operate.jsf">Operate</a>

        <h:form id="myForm">

            <h:inputText value="#{SomeBean.message}"> 
                <f:ajax/>
            </h:inputText>

            <h:commandButton value="Update message" action="#{SomeBean.update()}">
                <f:ajax render="myForm:displayMessage"/>
                <f:ajax render="myForm:displayDBMessages"/>
            </h:commandButton>

            <table>
                <tr>
                    <td>
                        Message:
                        <h:outputText value="#{SomeBean.message}" id="displayMessage" /><br/>

                        Log messages:
                        <h:dataTable value="#{SomeBean.messages}" var="item" id="displayDBMessages">
                            <h:column>
                                <f:facet name="header">
                                    <h:outputText value="Id"/>
                                </f:facet>
                                <h:outputText value="#{item.id}"/>
                            </h:column>
                            <h:column>
                                <f:facet name="header">
                                    <h:outputText value="Message"/>
                                </f:facet>
                                <h:outputText value="#{item.message}"/>
                            </h:column>
                        </h:dataTable>

                    </td>
                </tr>
            </table>

        </h:form>
    </h:body>
</html>